.productheader { background-image: url(../images/header_product.jpg);
   background-position: center center;
    background-repeat:no-repeat;
 margin-top:92px;   padding:150px 0px;  min-height:440px;

.topinfo {  text-align:cetner; padding-bottom:30px; 
	div { opacity:0; }
h2 { font-size:32px; @include bolderfont(); color:$maincolor;  }
p { font-size:16px; letter-spacing:0px; @include boldfont(); color:$maincolor; }
}

}




.s1 { opacity:0; }
.pbg1 { background:$white; }
.pbg2 { background:$cm1; }
.pbg3 { background:$cm2; }
.pbg4 { background:$cm3; }

.productmain  {  padding:30px 0px; min-height:500px; 
.col-12 { opacity:0; }
.mask { height:100%;  width:100%; position: absolute; top:0px; left:0px; opacity:0;}
.cm1 { background:$cm1; -webkit-clip-path: polygon(0 0, 100% 100%, 100% 100%, 0 100%);
clip-path: polygon(0 0, 100% 100%, 100% 100%, 0 100%);  }
.cm2 { background:$cm2; -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 0, 0 100%);
clip-path: polygon(0 100%, 100% 100%, 100% 0, 0 100%);  }
.cm3 { background:$cm3; -webkit-clip-path: polygon(0 0, 100% 100%, 100% 100%, 0 100%);
clip-path: polygon(0 0, 100% 100%, 100% 100%, 0 100%);}
.cm4 { background:$white; -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 0, 0 100%);
clip-path: polygon(0 100%, 100% 100%, 100% 0, 0 100%); }

.brandlogo { margin-top:80px; margin-bottom:10px; }
h2 { font-size:32px; @include bolderfont(); color:$maincolor; margin-bottom:45px;   }
p { font-size:16px; letter-spacing:0px; @include boldfont(); color:$maincolor; }


.productimg { 
img { padding-top:40px; }
}


a.showzoom, a.showzoom:visited { margin-top:30px !important;
color:$white !important;  transition: all 0.3s ease-in-out;
font-size:13px; @include boldfont();  border:0px !important; 
background: rgba(0,0,0,0.20);
border-radius: 3px; padding:15px 9px 15px 15px !important;
border-color:none!important; box-shadow:none!important; outline:0px!important;
span { margin-right:5px;  margin-left:3px; transition: all 0.6s ease-in-out;  img { margin-bottom:3px;   } }
}
a.showzoom:hover , a.showzoom:focus { 
 background: rgba(0,0,0,0.50);
color:$white !important;  transition: all 0.2s ease-in-out;
}


}




@include media-breakpoint-between(xs, md)  { 

.productheader { background-position:-990px 0px; }
.aboutmsg { padding:30px 0px;
.maintext { margin-top:0px;  background:none;
.d-flex { display:inline-block !important; }
.icon {margin-bottom:10px;  width:100% !important;   }
}
}

.productmain {
.brandlogo { margin-top:40px !important; margin-bottom:10px; }	
h2 { margin-bottom:0px;   }
a.showzoom { margin-top:10px !important; }
.productimg {  text-align: center;
img { padding-top:40px; width:80%;  }
}



}


}


